<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
	<title>来拍车App-抽奖页面</title>
	<link rel="stylesheet" href="{:get_style_cdnurl()}app/css/common.css">
	<link rel="stylesheet" href="{:get_style_cdnurl()}app/css/lottery.css"></head>
    <script src="{:get_style_cdnurl()}paimai/cheshan/js/TGJSBridge.js" type="text/javascript"></script>
	<script src="{:get_style_cdnurl()}paimai/cheshan/js/appclient.js" type="text/javascript"></script>
<body>
	<div class="lottery">
		<img src="{:get_style_cdnurl()}app/images/lottery-bg.jpg" alt="">
		<div class="lottery-inner">
			<img src="{:get_style_cdnurl()}app/images/lottery-bg2.png" alt="" class="lottery-bg2">
			<img src="{:get_style_cdnurl()}app/images/lottery.png" class="lottery-rotate" id="lottery-rotate">
			<img src="{:get_style_cdnurl()}app/images/lottery-btn.png" class="lottery-btn" alt="">
		</div>
	</div>
	<div class="activity-rule">
		<h2>活动规则</h2>
		<p class="rule-detail">
			活动期间在来拍车成交车辆，确认购车后可抽取金额不等的现金券直抵车款！现金券金额包括100元、300元、500元、1000元、2000元，该现金券不设找零、不兑现金，且仅限该辆车结算时使用。活动时间：{$starttime}-{$endtime}。
		</p>
	</div>

	<div class="popup-box">
		<h2>恭喜</h2>
		<div class="content">
			<p>抽中<span class="money">2000</span>元现金券！</p>
			<p class="desc">该现金券已经自动抵扣车款，可查看费用明细进行核实。</p>
			<span class="btn">确定</span>
		</div>
	</div>
	<input type="hidden" id='order_id' value="{$order_id}">
	<script type="text/javascript" src="{:get_style_cdnurl()}app/js/jquery.min.js"></script>
	<script type="text/javascript" src="{:get_style_cdnurl()}app/js/jQueryRotate.2.2.js"></script>
	<script type="text/javascript">
	$(document).ready(function() {
		var prizeArr = [100, 2000, 1000, 500, 300];
		$(".lottery-btn").on("click", function(e){
			lottery();
			e.stopPropagation();
		});

		$("body, span.btn").on("click", function(e){
			if ($(this).hasClass('btn')) {
				$("#lottery-rotate").rotate(0); // 重置到初始位置
			};
			$(".popup-box").hide();
		});

		function lottery(){
				var order_id = $("#order_id").val();
			    $.ajax({ 
			       	type: 'POST', 
			       	url: '/Raffle/get_face_value', 
			       	data:{order_id:order_id,type:1},
			       	dataType: 'json', 
			       	cache: false, 
			       	error: function(){
			       		appClient.toast('出错了！');
			           // alert('出错了！'); 
			           return false; 
			       	}, 
			        success:function(data){
				       	if (data.code ==200) {
			       			$(".lottery-btn").off("click");
							var moneyNum = Number(data.data.total_price);
							var randomValue = Math.floor(Math.random()*20);
							var endAngle = $.inArray(moneyNum, prizeArr)*36 + 10 + randomValue - 20;
							$("#lottery-rotate").rotate({ 
				        		angle:0,
								animateTo:endAngle+1800,
								duration:8000,
						        callback: function(){
						        	showPopbox(moneyNum)
							        $(".lottery-btn").on("click", lottery);
						        } 
				      		}); 
				       	}else if (data.code ==201) {
				       		appClient.toast(data.msg);
				       		// alert(data.msg);
				       	}else{
				       		appClient.toast(data.msg);
				       		// alert(data.msg);
				       	}
				    }
	    		}); 
		} 

		function showPopbox(moneyNum){
			$(".popup-box .money").text(moneyNum);
	    $(".popup-box").show();
		}
	});
	</script>
</body>
</html>